import { createRouter, createWebHashHistory } from 'vue-router'

// 导入页面组件
import Home from '../views/Home.vue'
import Tabs from '../views/Tabs.vue'

// 路由配置
const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home,
    redirect: '/tabs',
    meta: { title: '首页' },
    children: [
      {
        path: 'tabs',
        name: 'Tabs',
        component: Tabs,
        meta: { title: '标签页' },
      },
    ],
  },
]

// 创建路由实例
const router = createRouter({
  // 使用 Hash 模式 - Chrome 插件必须使用此模式
  history: createWebHashHistory(),
  routes,
})

// 路由守卫 - 设置页面标题
router.beforeEach((to, from, next) => {
  // 更新文档标题
  if (to.meta.title) {
    document.title = `${to.meta.title} - Vue3 Chrome Extension`
  }
  next()
})

export default router
